<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>从摄影作品中获取网页颜色搭配技巧_技术狂人</title>
<meta name="keywords" content="">
<meta name="description" content="作为一个优秀、专业的网页设计师，首先要了解各种颜色的象征，以及不同类型网站常用的色彩搭配。色彩搭配看似复杂,但并不神秘。一般来说,网页的背景色应该柔和一些、素一些、淡一些,再配上深色的文字,使人看起来自然、舒畅。色彩是人的视觉最敏感的东西。主页的色彩处理得好，可以锦上添花，达到事半功倍的效果。">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="static/css/base.css" rel="stylesheet">
<link href="static/css/index.css" rel="stylesheet">
<link href="static/css/info.css" rel="stylesheet">
<link href="static/css/m.css" rel="stylesheet">
<script src="static/js/jquery.min.js"></script>
<script src="static/js/jquery.easyfader.min.js"></script>
<script src="static/js/hc-sticky.js"></script>
<script src="static/js/comm.js"></script>

<script type="text/javascript" src="static/js/ajax.js"></script>
</head>
<body>
<header class="header-navigation" id="header">
  <nav>
    <div class="logo"><a href="index.html">技术狂人</a></div>
    <h2 id="mnavh"><span class="navicon"></span></h2>
 <ul id="starlist">
<li><a href="index.html">首页</a></li>
 
 
<li><a href="about.html">关于我</a></li> 
 
 
<li><a href="life.html">慢生活</a></li> 
 
 
<li class="selected"><a href="study.html">学无止境</a></li> 
 
 
<li><a href="time.html">时间轴</a></li> 
 
    </ul>
    <div class="searchbox">
    <div id="search_bar" class="search_bar">
      <form id="searchform" action="/e/search/index.php" method="post" name="searchform">
        <input class="input" placeholder="想搜点什么呢.." type="text" name="keyboard" id="keyboard">
        <input type="hidden" name="show" value="title">
        <input type="hidden" name="tempid" value="1">
        <input type="hidden" name="tbname" value="news">
        <input type="hidden" name="Submit" value="搜索">
        <p class="search_ico"> <span></span></p>
      </form>
     </div> 
    </div>
  </nav>
</header>
<article>
  <main>
  <div class="infosbox">
    <div class="newsview">
      <h3 class="news_title">从摄影作品中获取网页颜色搭配技巧</h3>
      <div class="bloginfo">
        <ul>
          <li class="author">
作者：冼子明</li>
          <li class="lmname">学习笔记</li>
          <li class="timer">2014-01-09</li>
          <li class="view"><script src="static/js/-14_33_1.js"></script>人已阅读</li>
        </ul>
      </div>
      <div class="tags"></div>
      <div class="news_about"><strong>简介</strong>作为一个优秀、专业的网页设计师，首先要了解各种颜色的象征，以及不同类型网站常用的色彩搭配。色彩搭配看似复杂,但并不神秘。一般来说,网页的背景色应该柔和一些、素一些、淡一些,再配上深色的文字,使人看起来自然、舒畅。色彩是人的视觉最敏感的东西。主页的色彩处理得好，可以锦上添花，达到事半功倍的效果。</div>
      <div class="news_con"><p>搭建一个网站，虽然布局第一、颜色其次。但颜色的搭配在用户视觉体验中确实最重要的元素。网页的色彩也是树立网站形象的关键之一。作为一个优秀、专业的网页设计师，首先要了解各种颜色的象征，以及不同类型网站常用的色彩搭配。色彩搭配看似复杂,但并不神秘。一般来说,网页的背景色应该柔和一些、素一些、淡一些,再配上深色的文字,使人看起来自然、舒畅。色彩是人的视觉最敏感的东西。主页的色彩处理得好，可以锦上添花，达到事半功倍的效果。</p>

<p><strong>颜色搭配常识：</strong></p>

<p>1.网页中色彩的表达使用三种颜色，及红(R)、绿(G)、蓝(B)，及通常所说的RGB色彩，它包含了人类所感知的所有颜色，网页中表达颜色如下（红色为例）RGB格式：红色是(255,0,0) 或十六进制hex格式为(FF0000)。</p>

<p>2.将色彩按&quot;红-&gt;黄-&gt;绿-&gt;蓝-&gt;红&quot;依次过度渐变可得到12色环：红，橙红，橙，橙黄，黄，黄绿，绿，蓝绿，蓝，蓝紫，紫，紫红。</p>

<p>3.颜色分非彩色和彩色两类。非彩色是指黑，白，灰系统色。彩色是指除了非彩色以外的所有色彩。通常内容文字用非彩色(黑色)，边框，背景，图片用彩色。所以即使页面丰富，看内容依然不会眼花,通常背景与内容对比要大。</p>

<p><strong>色彩的心理感觉</strong></p>

<p>红色---是一种激奋的色彩。刺激效果，能使人产生冲动，愤怒，热情，活力的感觉。</p>

<p>绿色---介于冷暖两中色彩的中间，显得和睦，宁静，健康，安全的感觉。 它和金黄，淡白搭配，可以产生优雅，舒适的气氛。</p>

<p>橙色---也是一种激奋的色彩，具有轻快，欢欣，热烈，温馨，时尚的效果。</p>

<p>黄色---具有快乐，希望，智慧和轻快的个性，它的明度最高。</p>

<p>蓝色---是最具凉爽，清新，专业的色彩。它和白色混合，能体现柔顺，淡雅，浪漫的气氛。</p>

<p>白色---具有洁白，明快，纯真，清洁的感受。</p>

<p>黑色---具有深沉，神秘，寂静，悲哀，压抑的感受。</p>

<p>灰色---具有中庸，平凡，温和，谦让，中立和高雅的感觉。</p>

<p><strong>网页配色忌讳</strong></p>

<p>1.不要将所有颜色都用到，尽量控制在三种色彩以内。</p>

<p>2.背景和前文的对比尽量要大，(绝对不要用花纹繁复的图案作背景)，以便突出主要文字内容</p>

<p><strong>摄影作品来获取颜色</strong></p>

<p>网页中背景图片也是至关重要的，使用一张大图片作为网页的背景是吸引访客眼球最快捷的方法。高质量的精美照片和抽象的设计图片能够给网站的外观带去深刻的影响。图片配合色彩是最完美的艺术。</p>

<p>&nbsp;图片来自<a href="http://design-seeds.com/" target="_blank"><span style="color: rgb(0, 0, 255);"><strong>http://design-seeds.com</strong></span></a></p>

<p>如果你还在为获取web颜色而烦恼的话，建议你使用<a href="http://colorschemedesigner.com/" target="_blank"><span style="color: rgb(0, 0, 255);"><strong>Color Scheme Designer</strong></span></a>取色工具，以不同的模式，可以让你一下获取相近的四个颜色。这也是我常用的取色工具</p>
 </div>
    </div>
    <div class="share">
<p class="diggit"><a href="JavaScript:makeRequest('/e/public/digg/?classid=14&id=33&dotop=1&doajax=1&ajaxarea=diggnum','EchoReturnedText','GET','');"> 很赞哦！ </a>(<b id="diggnum"><script type="text/javascript" src="static/js/-12_19_5.js"></script></b>)</p>

</div>
    <div class="nextinfo">
      <p>上一篇：<a href='32.html'>鼠标悬停图片、文字css3效果</a></p>
      <p>下一篇：<a href='biji.html'>返回列表</a></p>
    </div>
  </div>
  </main>
  <aside id="stickMe">
    <div class="r_box">     
      <div class="tuijian">
        <h2 id="tab"><a href="#" class="current">点击排行</a><a href="#">站长推荐</a></h2>       
     <div id="content">
        <ul style="display:block;">
          <li><a href="32.html" target="_blank">鼠标悬停图片、文字css3效果 </a></li>
          <li><a href="27.html" target="_blank">帝国cms常用标签调用方法总结（不得不收藏哦）... </a></li>
          <li><a href="30.html" target="_blank">css技巧以及经验总结 </a></li>
          <li><a href="" target="_blank">从摄影作品中获取网页颜色搭配技巧 </a></li>
          <li><a href="28.html" target="_blank">使用ASPCMS建站网站被黑 </a></li>
          <li><a href="29.html" target="_blank">IE6到底哪里不好？你还继续用IE6吗？ </a></li>
          <li><a href="31.html" target="_blank">IE常见bugs以及解决方案列表 </a></li>
        </ul>             
        <ul>
          <li><a href="27.html" target="_blank">帝国cms常用标签调用方法总结（不得不收藏哦）... </a></li>
          <li><a href="28.html" target="_blank">使用ASPCMS建站网站被黑 </a></li>
          <li><a href="29.html" target="_blank">IE6到底哪里不好？你还继续用IE6吗？ </a></li>
          <li><a href="30.html" target="_blank">css技巧以及经验总结 </a></li>
          <li><a href="31.html" target="_blank">IE常见bugs以及解决方案列表 </a></li>
          <li><a href="32.html" target="_blank">鼠标悬停图片、文字css3效果 </a></li>
          <li><a href="" target="_blank">从摄影作品中获取网页颜色搭配技巧 </a></li>
        </ul>
       </div>
      </div>
 <div class="wdxc">
        <h2>图文精选</h2>
        <ul>
                     <li><a href="29.html" title="IE6到底哪里不好？你还继续用IE6吗？" target="_blank"><img src="static/picture/b1d8cde248671b1e75ef302609595b1f.jpg"></a></li>
                     <li><a href="18.html" title="IP要突破2000+了" target="_blank"><img src="static/picture/a85973b7e8d151108aee2deb83c18f97.jpg"></a></li>
                     <li><a href="30.html" title="css技巧以及经验总结" target="_blank"><img src="static/picture/ce3c6881c5f27e55588f8f9843d8be38.jpg"></a></li>
                     <li><a href="28.html" title="使用ASPCMS建站网站被黑" target="_blank"><img src="static/picture/2ab0bdcc2d40794f183031053dd1a4d2.jpg"></a></li>
                     <li><a href="35.html" title="帝国cms列表页调用关键字tag标签" target="_blank"><img src="static/picture/fbe877634a8eb658f4d19b83c960d6ab.png"></a></li>
                     <li><a href="31.html" title="IE常见bugs以及解决方案列表" target="_blank"><img src="static/picture/1ed9f310ffdbfdbb4c695671233296b5.jpg"></a></li>
                   </ul>
      </div>
<div class="cloud">
      <h2>标签云</h2>
      <ul>
 <a href="tags.html" target="_blank">云南</a>      </ul>
    </div>
      <div class="guanzhu">
        <h2>关注我 么么哒</h2>
        <ul>
          <img src="static/picture/wx.png">
        </ul>
      </div>
    </div>
  </aside>
</article>
<footer>
  <p>Design by <a href="index.html" target="_blank">技术狂人</a> <a href="http://beian.miit.gov.cn/get="_blank">粤ICP备2024236460号-4</a></p>
</footer>
<a href="#" class="cd-top">Top</a><script src="static/js/js.js"></script></body>
</html>
